<template>
  <div style="width: 100%">
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="员工ID" prop="id">
        <el-input v-model="form.id" style="width: 300px" disabled></el-input>
      </el-form-item>
      <el-form-item label="科室" prop="desc">
        <el-select v-model="form.desc" placeholder="请选择科室">
          <el-option label="1科" value="1"></el-option>
          <el-option label="2科" value="2"></el-option>
          <el-option label="3科" value="3"></el-option>
          <el-option label="4科" value="4"></el-option>
          <el-option label="5科" value="5"></el-option>
          <el-option label="6科" value="6"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="请假时间" prop="makeTime">
        <el-col :span="11">
          <el-date-picker
            type="daterange"
            v-model="form.startTime"
            style="width: 100%"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          >
            ></el-date-picker
          >
        </el-col>
      </el-form-item>

      <el-form-item label="请假事由" prop="reason">
        <el-input type="textarea" v-model="form.reason" :rows="10" style="width: 700px" ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="onSubmit('form')">发送审批</el-button>
        <el-button type="primary" @click="reset('form')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import qs from "qs";
export default {
  data() {
    return {
      form: {
        id: this.$store.state.ID,
        region: "",
        startTime: "",
        desc: "",
        post: 0,
      },
    };
  },
  methods: {
    onSubmit(form) {
      this.form.startTime = this.form.startTime.toString()
      if (this.form.id == this.$store.state.ID) {
        this.$axios
          .post("/AskLeave/saveAskLeave", qs.stringify(this.form))
          .then((res) => {
            if (res.data) {
              this.$message.success("发送成功");
              this.reset(form);
            } else {
              this.$message.error("请假时长超时");
            }
          });
      } else {
        this.$message.error("ID应为本人ID");
      }
    },
    reset(form) {
      this.$refs[form].resetFields();
    },
  },
};
</script>